<!-- templates/account_search.html -->
<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <title>基金管理系统</title>
    <link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='img/favicon.ico') }}">
    <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/5.1.3/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css') }}">
</head>
<body class="account-page">
    <div class="main-container">
        <!-- 基金汇总信息 -->
        <div class="funds-summary-container">
            <h2 class="summary-title">基金汇总信息</h2>
            {% if funds_summary %}
            <div class="row g-4">
                <div class="col-md-4">
                    <div class="summary-card p-3">
                        <h5 class="card-title">基本信息</h5>
                        <div class="info-item">
                            <span class="info-label">更新时间</span>
                            <span class="info-value">{{ funds_summary.get('updatetime', '').split(' ')[0] }}</span>
                        </div>
                        <div class="info-item">
                            <span class="info-label">最新净值</span>
                            <span class="info-value">{{ "%.3f"|format(funds_summary.get('sNetAssetValue', 0)) }}</span>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="summary-card p-3">
                        <h5 class="card-title">投资信息</h5>
                        <div class="info-item">
                            <span class="info-label">总投资金额</span>
                            <span class="info-value">
                                <span class="currency">¥</span>{{ "{:,.2f}".format(funds_summary.get('InvestmentAmount', 0)) }}
                            </span>
                        </div>
                        <div class="info-item">
                            <span class="info-label">总份额</span>
                            <span class="info-value">{{ "{:,.2f}".format(funds_summary.get('TotalShare', 0)) }}</span>
                        </div>
                        <div class="info-item">
                            <span class="info-label">总资产</span>
                            <span class="info-value">
                                <span class="currency">¥</span>{{ "{:,.2f}".format(funds_summary.get('TotalAssets', 0)) }}
                            </span>
                        </div>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="summary-card p-3">
                        <h5 class="card-title">收益信息</h5>
                        <div class="info-item">
                            <span class="info-label">总收益</span>
                            <span class="info-value {{ 'text-danger' if funds_summary.get('Earnings', 0) > 0 else 'text-success' }}">
                                {{ "+" if funds_summary.get('Earnings', 0) > 0 else "" }}
                                <span class="currency">¥</span>{{ "{:,.2f}".format(funds_summary.get('Earnings', 0)) }}
                            </span>
                        </div>
                        <div class="info-item">
                            <span class="info-label">盈利率</span>
                            <span class="info-value {{ 'text-danger' if funds_summary.get('Yield', 0) > 0 else 'text-success' }}">
                                {{ "+" if funds_summary.get('Yield', 0) > 0 else "" }}{{ "%.2f"|format(funds_summary.get('Yield', 0)) }}%
                            </span>
                        </div>
                    </div>
                </div>
            </div>
            {% else %}
            <div class="alert alert-warning">
                没有可用的基金信息
            </div>
            {% endif %}

            <div class="mt-4">
                <h5 class="card-title">净值曲线</h5>
                <div class="btn-group">
                    <button class="btn btn-outline-primary" data-period="week">近一周</button>
                    <button class="btn btn-outline-primary active" data-period="month">近一月</button>
                    <button class="btn btn-outline-primary primary" data-period="3month">近三月</button>
                    <button class="btn btn-outline-primary" data-period="this-month">本月</button>
                    <button class="btn btn-outline-primary" data-period="year">本年</button>
                    <button class="btn btn-outline-primary" data-period="all">成立以来</button>
                </div>
                <div class="plotly-container" id="plotly-chart"></div>
            </div>
        </div>

        <!-- Tab 容器 -->
        <div class="tab-container mt-4">
            <ul class="nav nav-tabs" id="myTabs" role="tablist">
                <li class="nav-item" role="presentation">
                    <button class="nav-link active" id="account-tab" data-bs-toggle="tab" data-bs-target="#account-content" type="button" role="tab" aria-controls="account-content" aria-selected="true">账户信息</button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" id="NetAssetValueupdate-tab" data-bs-toggle="tab" data-bs-target="#NetAssetValueupdate-content" type="button" role="tab" aria-controls="NetAssetValueupdate-content" aria-selected="false">净值更新</button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" id="purchase-tab" data-bs-toggle="tab" data-bs-target="#purchase-content" type="button" role="tab" aria-controls="purchase-content" aria-selected="false">购买(赎回)</button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" id="details-tab" data-bs-toggle="tab" data-bs-target="#details-content" type="button" role="tab" aria-controls="details-content" aria-selected="false">交易记录</button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" id="setdividends-tab" data-bs-toggle="tab" data-bs-target="#setdividends-content" type="button" role="tab" aria-controls="setdividends-content" aria-selected="false">设置分红</button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" id="dividends-tab" data-bs-toggle="tab" data-bs-target="#dividends-content" type="button" role="tab" aria-controls="dividends-content" aria-selected="false">分红记录</button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link" id="total-dividends-tab" data-bs-toggle="tab" data-bs-target="#total-dividends-content" type="button" role="tab" aria-controls="total-dividends-content" aria-selected="false">总分红记录</button>
                </li>
            </ul>

            <!-- Tab 内容 -->
            <div class="tab-content" id="myTabsContent">
                <!-- 账户信息 Tab -->
                <div class="tab-pane fade show active" id="account-content" role="tabpanel" aria-labelledby="account-tab">
                    <form class="form-container" id="account_form" data-action="query" data-table="account" action="/search_account" method="post">
                        <div class="form-row">
                            <div class="form-inputs">
                            <input type="text" class="form-control input-width-md" name="search_name" placeholder="输入姓名">
                            </div>
                            <div class="form-actions">
                            <button type="submit" class="btn btn-primary btn-width-sm">查询</button>
                            </div>
                        </div>
                    </form>
                    <div class="table-responsive mt-3">
                        <table id="accountTable" class="table table-hover">
                            <thead>
                                <tr>
                                    <th>姓名</th>
                                    <th>总投资金额</th>
                                    <th>总份额</th>
                                    <th>总资产</th>
                                    <th>成本净值</th>
                                    <th>总收益</th>                                    
                                    <th>盈利率</th>
                                    <th>更新时间</th>
                                </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                        <div id="account-pagination" data-table="account" class="pagination-container" style="display: none;"></div>
                    </div>
                </div>

                <!-- 净值更新 Tab -->
                <div class="tab-pane fade" id="NetAssetValueupdate-content" role="tabpanel" aria-labelledby="NetAssetValueupdate-tab">
                    <form class="form-container" id="NetAssetValueupdate_form" data-action="update" action="/setNetAssetValue" method="post">
                        <div class="form-row">
                            <input type="date" class="form-control input-width-md date-input" name="date" required>
                            <input type="number" class="form-control input-width-md" name="TotalAssets" step="0.01" placeholder="请输入总资产金额" required>
                            <button type="submit" class="btn btn-primary btn-width-sm">更新</button>
                        </div>
                    </form>
                </div>

                <!-- 购买(赎回) Tab -->
                <div class="tab-pane fade" id="purchase-content" role="tabpanel" aria-labelledby="purchase-tab">
                    <form class="form-container" id="purchase" data-action="update" action="/Trade" method="post">
                        <div class="form-row">
                            <input type="date" class="form-control input-width-md date-input" name="date" required>
                            <input type="number" class="form-control input-width-md" name="oldTotalAssets" step="0.01" placeholder="{{ funds_summary.TotalAssets }}">
                        </div>
                        <div class="form-row">
                            <input type="text" class="form-control input-width-md" name="name" placeholder="输入姓名" required>
                            <input type="number" class="form-control input-width-md" name="money" step="0.01" placeholder="输入金额" required>
                        </div>
                        <div class="form-row">
                            <select class="form-select input-width-md" name="action" id="action">
                                <option value="1">申购</option>
                                <option value="0">赎回</option>
                                <option value="2">分红买入</option>
                            </select>
                            <select class="form-select input-width-md" name="ifall" id="ifall" style="display: none;">
                                <option value="yes">全部赎回</option>
                                <option value="no">部分赎回</option>
                            </select>
                            <button type="submit" class="btn btn-primary btn-width-sm">提交</button>
                        </div>
                    </form>
                </div>

                <!-- 交易记录 Tab -->
                <div class="tab-pane fade" id="details-content" role="tabpanel" aria-labelledby="details-tab">
                    <form class="form-container" id="Statement_form" data-action="query" data-table="Statement" action="/accountStatement" method="post">
                        <div class="form-row">
                            <div class="form-inputs">
                                <input type="text" class="form-control input-width-md" name="search_name" placeholder="输入姓名（为空则查询所有记录）">
                            </div>
                            <div class="form-actions">
                                <button type="submit" class="btn btn-primary btn-width-sm">查询</button>
                            </div>
                        </div>
                    </form>
                    <div class="table-responsive mt-3">
                        <table id="accountStatementTable" class="table table-hover">
                            <thead>
                                <tr>
                                    <th>姓名</th>
                                    <th>操作</th>
                                    <th>金额</th>
                                    <th>实时净值</th>
                                    <th>基金份额</th>
                                    <th>操作日期</th>
                                </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                        <div id="Statement-pagination" data-table="Statement" class="pagination-container" style="display: none;"></div>
                    </div>
                </div>

                <!-- 设置分红 Tab -->
                <div class="tab-pane fade" id="setdividends-content" role="tabpanel" aria-labelledby="setdividends-tab">
                    <form class="form-container" id="setdividends_form" data-action="update" action="/setDividends" method="post">
                        <div class="form-row">
                            <input type="date" class="form-control input-width-md date-input" name="date" required>
                            <input type="number" class="form-control input-width-md" step="0.001" name="DividendRatio" placeholder="输入每份红利金额" required>
                            <button type="submit" class="btn btn-primary btn-width-sm">提交</button>
                        </div>
                    </form>
                </div>

                <!-- 分红记录 Tab -->
                <div id="dividends-content" class="tab-pane">
                    <form class="form-container" id="dividends_form" data-action="query" data-table="dividends" action="/getDividends" method="post">
                        <div class="form-row">
                            <div class="form-inputs">
                                <input type="text" class="form-control input-width-md" name="search_name" placeholder="输入姓名（为空则查询所有记录）">
                            </div>
                            <div class="form-actions">
                                <button type="submit" class="btn btn-primary btn-width-sm">查询</button>
                            </div>
                        </div>
                    </form>
                    <div class="table-responsive mt-3">
                        <table id="dividendsTable" class="table table-hover">
                            <thead>
                                <tr>
                                    <th>姓名</th>
                                    <th>分红份额</th>
                                    <th>分红金额</th>
                                    <th>分红日期</th>
                                </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                        <div id="dividends-pagination" data-table="dividends" class="pagination-container" style="display: none;"></div>
                    </div>
                </div>

                <!-- 总分红记录 Tab -->
                <div class="tab-pane fade" id="total-dividends-content" role="tabpanel" aria-labelledby="total-dividends-tab">
                    <div class="table-responsive mt-3">
                        <table id="total-dividendsTable" class="table table-hover">
                            <thead>
                                <tr>
                                    <th>总分红份额</th>
                                    <th>每份红利金额</th>
                                    <th>分金额</th>
                                    <th>分红日期</th>
                                </tr>
                            </thead>
                            <tbody></tbody>
                        </table>
                        <div id="total-dividends-pagination" data-table="total-dividends" class="pagination-container" style="display: none;"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 退出按钮 -->
    <button id="logout-button" type="button" class="btn btn-danger">
        <i class="fas fa-sign-out-alt"></i>
        <span class="d-none d-md-inline">退出系统</span>
    </button>

    <!-- Scripts -->
    <script src="{{ url_for('static', filename='js/jquery-3.7.1.min.js') }}"></script>
    <script src="{{ url_for('static', filename='js/bootstrap.bundle.min.js') }}"></script>
    <script src="{{ url_for('static', filename='js/plotly-basic.min.js') }}"></script>
    <script src="{{ url_for('static', filename='js/scripts.js') }}"></script>
    <script src="{{ url_for('static', filename='js/form.js') }}"></script>
    <script src="{{ url_for('static', filename='js/plotly.js') }}"></script>
</body>
</html>